<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Jquery</title>
    <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<h2>这是一个标题</h2>
<p class="p1">这是一个段落</p>
<p class="p2">这是另一个段落</p>
<p class="p3">这是第三个段落</p>
<p class="p4">这是第四个段落</p>
<p class="p5">这是第五个段落</p>
<p class="p6">这是第六个段落</p>
<p class="p7">这是第七个段落</p>
<button id="hide1">点我</button><br>
Name:<input type="text" name="fullname"><br>
Email:<input type="text" name="email"><br>
<button id="hide2">隐藏</button>
<button id="show2">显示</button><br>
<div style="width: 300px;background-color: aquamarine;height: 200px">
    <p id="toggle">点我显示/隐藏</p>
    <div style="background-color: beige;width: auto;height: 180px" id="toggleObject"></div>
</div>
<br>

<button id="fadein">点我淡入</button><br>
<div style="background-color: aquamarine;width: 80px;height: 80px;display: none" id="fadein1" ></div><br>
<div style="background-color: coral;width: 80px;height: 80px;display: none" id="fadein2"></div><br>
<div style="background-color: fuchsia;width: 80px;height: 80px;display: none" id="fadein3"></div><br>

<button id="fadeout">点我淡出</button><br>
<div style="background-color: aquamarine;width: 80px;height: 80px;" id="fadeout1"></div><br>
<div style="background-color: coral;width: 80px;height: 80px;" id="fadeout2"></div><br>
<div style="background-color: fuchsia;width: 80px;height: 80px;" id="fadeout3"></div><br>

<button id="fadetoggle">点我淡入/淡出</button><br>
<div style="background-color: aquamarine;width: 80px;height: 80px;" id="fadetoggle1"></div><br>
<div style="background-color: coral;width: 80px;height: 80px;" id="fadetoggle2"></div><br>
<div style="background-color: fuchsia;width: 80px;height: 80px;" id="fadetoggle3"></div><br>

<button id="fadeto">点我不同透明度</button><br>
<div style="background-color: fuchsia;width: 80px;height: 80px;" id="fadeto1"></div><br>
<div style="background-color: fuchsia;width: 80px;height: 80px;" id="fadeto2"></div><br>
<div style="background-color: fuchsia;width: 80px;height: 80px;" id="fadeto3"></div><br>

<button id="slide">点我滑动</button><br>
<div style="background-color: aquamarine;width: 80px;height: 80px;display: none" id="slide1"></div><br>
<div style="background-color: coral;width: 80px;height: 80px;" id="slide2"></div><br>
<div style="background-color: fuchsia;width: 80px;height: 80px;" id="slide3"></div><br>

<button id="animate">点我开始动画</button>
<button id="animateStop">点我停止动画</button>
<br>
<div style="background-color: coral;width: 100px;height: 100px;position: relative" id="animate1">从小就梦想仗剑闯天涯</div><br>
<button id="chain">jQuery链</button>

<script src="index.js"></script>
</body>
</html>